<template>
  <div>
    <button @click="onDispatchGetXHR()">发送get请求</button>
    <button @click="onDispatchPostXHR()">发送post请求(综合)</button>
    <button @click="onDispatchPostXHRTwo()">发送post请求(query带参数)</button>
  </div>
</template>

<script lang="ts" setup>
import createClient from '../assets/index'
import {paths} from '../assets/schema'
import axios from "axios";

const {get, post} = createClient<paths>(axios);

async function onDispatchGetXHR() {
  await get('/flow/Breakage/GetFlowInfo', {
    headers: {
      'X-Requested-With': 'XMLHttpRequest222'
    },
    params: {
      flowKey: '2222',
      popupMark: '123456'
    },
    // `paramsSerializer`是可选方法，主要用于序列化`params`
    paramsSerializer: (query) => {
      console.log(query)
      return '?popupMark=111&flowKey=2222'
    },
  }).then(res => {
    console.log(res.data.popupMark)
    console.log(res)
  }).catch(reason => {
    console.log(reason)
  });
}

function onDispatchPostXHR() {
  post('/flow/Breakage/GetBreakageToPage', {
    headers: {
      // 自定义请求头
      'X-Requested-With': 'XMLHttpRequest'
    },
    // query 带参数
    params: {
      popupMark: '111',
      flowKey: '2222'
    },
    data: {
      pageIndex: 10,
      pageSize: 30,
      ownerName: {
        searchType: 0,
        value: '111'
      }
    }
  })
}

function onDispatchPostXHRTwo() {
  post('/flow/CustomerInvoiceSettlement/RemoveAudit', {
    params: {
      flowKey: '2222'
    }
  })
}
</script>
